
<div class="uc-panel">
  <div class="uc-bigtit">我的订单</div>
  <div class="uc-panel-bd">
    <div class="uc-sort">
      <div class="uc-tabs">
        <a class="item active" href="javascript:" (click)="initOrderList(1,10,null,null)">所有订单</a>
        <a class="item" href="javascript:" (click)="initOrderList(1,10,null,'NO_PAY')">待付款</a>
        <a class="item" href="javascript:" (click)="initOrderList(1,10,null,'PAID')">待发货</a>
        <a class="item" href="javascript:" (click)="initOrderList(1,10,null,'SHIPPED')">待收货</a>
        <a class="item" href="javascript:" (click)="initOrderList(1,10,null,'ORDER_SUCCESS')">待评价</a>
      </div>
      <div class="uc-search">
        <form>
          <input type="text" style="height: 40px;" class="sch-input" [ngModelOptions]="{standalone: true}" [(ngModel)]="searchOrderNo" placeholder="输入订单号" />
          <button class="sch-btn" (click)="search()"><i class="iconfont icon-search"></i></button>
        </form>
      </div>
    </div>
    <table class="uc-table">
      <thead>
      <th></th>
      <th></th>
      <th></th>
      <th></th>
      </thead>
     <tbody>
       <div *ngFor="let order of orderList">
         <tr class="hd order-meta" >
           <td colspan="3">
             <div class="left">创建时间：{{order.createTime | date: 'yyyy-MM-dd HH:mm:ss'}} &nbsp;&nbsp;订单号: {{order.orderNo}}</div>
             <span class="center">总价：<span class="text-theme fwb">{{order.payment}}元</span></span>
           </td>
           <td>{{order.statusDesc}}</td>
           <td>
             <div class="right"><span class="del iconfont icon-shanchu"></span></div>
           </td>
         </tr>
         <tr class="order-goods" *ngFor="let orderItem of order.orderItemList">
           <td>
             <div class="goods-info">
               <img class="figure" src="{{orderItem.productImage}}" alt="商品" />
               <div class="info">
                 <div>{{orderItem.productName}}</div>
               </div>
             </div>
             <a class="text-info refund" style="margin-top: 15px;" href="javascript:" *ngIf="order.statusCode>=20 && order.statusCode<50">退款/货</a>
           </td>
           <td>
             x<span>{{orderItem.quantity}}</span>
           </td>
           <td>
             <span class="text-theme fwb">{{orderItem.totalPrice}}元</span>
           </td>
           <td >
             <span class="status" *ngIf="order.statusCode==50">快件已签收</span><br>
             <a class="text-info" href="javascript:" *ngIf="order.statusCode>=40 && order.statusCode<=50">查看物流</a>
           </td>
           <td style="width: 10%">
             <a href="javascript:" class="ui-btn-theme uc-btn-md" (click)="orderDetail(order.id)">订单详情</a><br><br>
             <a href="javascript:" class="ui-btn-low uc-btn-md" *ngIf="order.statusCode==50">追加评论</a>
           </td>
         </tr>
       </div>
       <tr *ngIf="orderList.length == 0">
         <td colspan="4">
           <span class="center">没有找到相关订单</span>
         </td>
       </tr>
     </tbody>

    </table>

    <div style="text-align: center"> <ul id="pageLimit"></ul> </div>
  </div>
</div>

